import React from 'react';
import { Modal, Form, Spin, ConfigProvider } from 'antd';
import { connect } from 'umi';
import { ZPJDSZ } from './Form';

const formItemLayout = {
    labelCol: {
        md: { span: 6 },
        xs: { span: 24 },
        sm: { span: 24 }
    },
    wrapperCol: {
        md: { span: 14 },
        xs: { span: 24 },
        sm: { span: 24 }
    }
};
/**
 * Manipulate 招聘进度快速设置 Modal
 * 不需要进入详情页 直接编辑招聘进度
 * 这里偷懒== 直接关联 positionManage Model ,做招聘进度的update与数据获取操作
 * @param location 当前路径信息 用来查询自定义字典 pathNameMap
 */
class Manipulate extends React.PureComponent {
    constructor(props) {
        super(props);
        this.state = {
            visible: false,
            recruitCode: '',
            companyId: null
        };
    }

    show = async ({ recruitCode, companyId }) => {
        const {
            dispatch,
            location: { pathname }
        } = this.props;
        dispatch({
            type: 'positionManage/fetchRecruitSchedule',
            payload: { recruitCode },
            dictionary: {
                pathName: pathname,
                // 是否是 列表页直接操作 招聘进度
                isModal: true
            }
        });
        this.setState({ visible: true, recruitCode, companyId });
    };

    handleOk = async () => {
        const {
            form,
            dispatch,
            location: { pathname },
            onOk
        } = this.props;
        const { recruitCode } = this.state;
        const {
            leaderIds,
            recruitSource = [],
            ...params
        } = form.getFieldsValue();
        await dispatch({
            type: 'positionManage/updateRecruit',
            payload: {
                recruitCode,
                recruitSource: recruitSource.join(),
                leaderIds,
                ...params
            },
            dictionary: {
                pathName: pathname,
                // isModal 是否是 列表页直接操作 招聘进度
                isModal: true
            }
        });
        onOk();
        this.setState({ visible: false });
    };

    render() {
        const { visible, companyId } = this.state;
        const { form, positionManage, location, loading } = this.props;
        return (
            <Modal
                title="招聘需求设置"
                width={900}
                visible={visible}
                confirmLoading={loading}
                onOk={this.handleOk}
                destroyOnClose
                onCancel={() => this.setState({ visible: false })}
            >
                <ConfigProvider
                    getPopupContainer={trigger => trigger.parentNode}
                >
                    <Spin spinning={loading}>
                        <Form
                            layout="horizontal"
                            {...formItemLayout}
                            onSubmit={this.handleOk}
                        >
                            <ZPJDSZ
                                location={location}
                                form={form}
                                isModal
                                editZPJD
                                query={{ companyId }}
                                formData={positionManage.recruitSchedule}
                            />
                        </Form>
                    </Spin>
                </ConfigProvider>
            </Modal>
        );
    }
}
const mapStateToProps = ({ positionManage, loading }) => ({
    positionManage,
    loading: loading.global
});
export default connect(mapStateToProps)(Form.create()(Manipulate));
